<!DOCTYPE html>
<html>
<head>
    @include("/include/_header.html", {'title':'告警记录'}){}
    <script src="${ctxPath}/guidesys/RoadGate/js/echarts.min.js"></script>
    <style>
        .floatleft{
            float:left;
        }
        .floatclear::after{
            content:"";
            display:block;
            clear:both;
        }
        .statEchart{
            margin-top: 3%;
            margin-left: 2%;
        }
    </style>
</head>
<body>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-header">查询</div>
                <div class="layui-card-body">
                    <div class="layui-form">
                        <div class="test-table-reload-btn" style="margin-bottom: 1vh;">
                            告警位置：
                            <div class="layui-inline">
                                <select class="layui-input" style="width:18vw" name="carName" id="carName">
                                    <option value=""></option>
                                    <option value="1号渣钢跨天车">1号渣钢跨天车</option>
                                    <option value="2号渣钢跨天车">2号渣钢跨天车</option>
                                    <option value="1号废钢跨天车">1号废钢跨天车</option>
                                    <option value="2号废钢跨天车">2号废钢跨天车</option>
                                    <option value="宽轨槽车扫描仪">宽轨槽车扫描仪</option>
                                    <option value="双轨槽车扫描仪">双轨槽车扫描仪</option>
                                    <option value="渣钢1库区扫描仪">渣钢1库区扫描仪</option>
                                    <option value="渣钢2库区扫描仪">渣钢2库区扫描仪</option>
                                    <option value="废钢1库区扫描仪">废钢1库区扫描仪</option>
                                    <option value="废钢2库区扫描仪">废钢2库区扫描仪</option>
                                </select>
                            </div>

                            告警状态：
                            <div class="layui-inline">
                                <select class="layui-input" style="width:18vw" name="status" id="status">
                                    <option value=""></option>
                                    <option value="doing">处理中</option>
                                    <option value="init">未处理</option>
                                    <option value="error">失败</option>
                                    <option value="done">已处理</option>
                                </select>
                            </div>

                            发生时间：
                            <div class="layui-inline">
                                <input class="layui-input"  name="happenStartDateStr" id="happenStartDateStr" autocomplete="off" placeholder="YYYY-MM-DD">
                            </div>
                            到：
                            <div class="layui-inline">
                                <input class="layui-input"  name="happenEndDateStr" id="happenEndDateStr"  autocomplete="off" placeholder="YYYY-MM-DD">
                            </div>


                            <div class="layui-row" style="margin-top: 1vh">
                                <div class="layui-col-md2 layui-col-md-offset10">
                                    <button id="btnSearch" class="layui-btn">搜索</button>
                                    <button id="btnReset" class="layui-btn">重置</button>

                                </div>
                            </div>

                        </div>
                    </div>
                    <div class="floatclear" >
                        <div class="floatleft" style="width: 60%">
                            <table class="layui-hide floatleft" id="alarm-info" lay-filter="alarm-info" style="width: 60%"></table>
                        </div>
                        <div  class="floatleft statEchart" id="statEchart" style="width:35%;height:300px;">
                    </div>


                </div>
                <!-- 表格操作按钮 -->
                <script type="text/html" id="online-status">
                    {{#  if(d.status == '处理中'){ }}
                    <button class="layui-btn layui-bg-orange layui-btn-xs">处理中</button>
                    {{#  } else if(d.status == '未处理') { }}
                    <button class="layui-btn layui-btn-danger layui-btn-xs">未处理</button>
                    {{#  } else if(d.status == '已处理') { }}
                    <button class="layui-btn  layui-btn-xs">已处理</button>
                    {{#  } else if(d.status == '失败') { }}
                    <button class="layui-btn  layui-btn-disabled layui-btn-xs">失败</button>
                    {{#  } }}
                </script>

                <!-- 表格操作按钮 -->
                <script type="text/html" id="sys-alarm-tool">
                    <t:a cssClass="layui-btn  layui-btn-xs" layEvent="edit" label="编辑"></t:a>
                    <!--                    <t:a cssClass="layui-btn layui-btn-danger layui-btn-xs" layEvent="del" label="删除" id = "open"></t:a>-->

                </script>


            </div>
        </div>
    </div>
</div>

<script src="${ctxPath}/assets/sys/alarm/alarm_index.js"></script>

</body>
</html>

